<apes-picker
  [isRange]="isRange"
  [value]="apesValue"
  (valueChange)="onValueChange($event)"
  [open]="apesOpen"
  [disabled]="apesDisabled"
  [format]="apesFormat"
  [allowClear]="apesAllowClear"
  [autoFocus]="apesAutoFocus"
  [className]="apesClassName"
  [placeholder]="apesPlaceHolder"
  [size]="apesSize"
  [style]="apesStyle"
  [noAnimation]="noAnimation?.apesNoAnimation"
  (openChange)="onOpenChange($event)"
>
  <date-range-popup *ngIf="realOpenState"
    [isRange]="isRange"
    [showWeek]="showWeek"
    [panelMode]="apesMode"
    (panelModeChange)="apesOnPanelChange.emit($event)"
    [value]="apesValue"
    (valueChange)="onValueChange($event)"
    (calendarChange)="onCalendarChange($event)"
    [locale]="apesLocale?.lang"
    [showToday]="realShowToday"
    [showTime]="apesShowTime"
    [format]="apesFormat"
    [dateRender]="apesDateRender"
    [disabledDate]="apesDisabledDate"
    [disabledTime]="apesDisabledTime"
    [placeholder]="apesPlaceHolder"
    [dropdownClassName]="apesDropdownClassName"
    [popupStyle]="apesPopupStyle"
    [extraFooter]="extraFooter"
    [ranges]="apesRanges"
    (resultOk)="onResultOk()"
    (closePicker)="closeOverlay()"
  ></date-range-popup>
</apes-picker>
